HTML
Básico
2.1.
Estructura
de
un
documento
HTML
HTML
(HyperText
Markup
Language)
es
el
lenguaje
que
usamos
para
crear
páginas
web.
Un
documento
HTML
está
compuesto
por
etiquetas
que
le
dicen
al
navegador
cómo
mostrar
el
contenido.
Estructura
básica
de
un
documento
HTML
Todo
documento
HTML
sigue
una
estructura
fundamental.
Observa
este
ejemplo:
<!DOCTYPE
html>
<html>
<head>
<title>Mi
Primera
Página</title>
</head>
<body>
<h1>Hola,
mundo!</h1>
<p>Bienvenido
a
mi
primera
página
web.</p>
</body>
</html>
Explicación
de
las
etiquetas
principales:
●
<!DOCTYPE
html>
:
Indica
que
el
documento
es
un
archivo
HTML5.
●
<html>
:
Es
la
etiqueta
principal
que
engloba
todo
el
contenido
de
la
página.
●
<head>
:
Contiene
información
sobre
la
página
(como
el
título
y
configuraciones).
●
<title>
:
Define
el
título
que
aparece
en
la
pestaña
del
navegador.
●
<body>
:
Contiene
el
contenido
visible
de
la
página.
Encabezados,
Párrafos,
Enlaces
y
Listas
En
HTML,
usamos
diferentes
etiquetas
para
estructurar
el
contenido
de
una
página.
1.
Encabezados
(
<h1>
a
<h6>
)
Los
encabezados
permiten
organizar
el
contenido
de
una
página
de
mayor
a
menor
importancia.
Ejemplo:
<h1>Encabezado
principal</h1>
<h2>Subtítulo</h2>
<h3>Sección</h3>
<h4>Subsección</h4>
<h5>Detalle</h5>
<h6>Nota
pequeña</h6>
2.
Párrafos
(
<p>
)
Los
párrafos
se
usan
para
escribir
texto
en
la
página.
Ejemplo:
<p>Este
es
un
párrafo
de
texto.</p>
3.
Enlaces
(
<a>
)
Los
enlaces
permiten
navegar
a
otras
páginas
o
sitios
web.
Ejemplo:
<a
href="https://www.google.com">Ir
a
Google</a>
4.
Listas
(
<ul>
y
<ol>
)
Las
listas
organizan
información
en
forma
de
viñetas
o
numeración.
●
Lista
desordenada
(
<ul>
)
:
Usa
viñetas.
<ul>
<li>Elemento
1</li>
<li>Elemento
2</li>
<li>Elemento
3</li>
</ul>
●
Lista
ordenada
(
<ol>
)
:
Usa
números.
<ol>
<li>Primer
paso</li>
<li>Segundo
paso</li>
<li>Tercer
paso</li>
</ol>
Ejercicio
Práctico
Crea
un
archivo
llamado
mi_pagina.html
con
el
siguiente
contenido:
<!DOCTYPE
html>
<html>
<head>
<title>Mi
Página
Web</title>
</head>
<body>
<h1>Bienvenido
a
mi
página</h1>
<p>Este
es
un
párrafo
de
presentación.</p>
<a
href="https://www.wikipedia.org">Visitar
Wikipedia</a>
<h2>Lista
de
cosas
que
me
gustan:</h2>
<ul>
<li>Programación</li>
<li>Música</li>
<li>Leer
libros</li>
</ul>
</body>
</html>
Guarda
el
archivo
y
ábrelo
en
tu
navegador
para
ver
el
resultado.
Asi
te
deberia
quedar:
Contactanos
Español
Sin
Fronteras
Gmail
espanolsinfronteras1@gmail.com
Español
Sin
Fronteras
-
Recursos
Educativos
Gratuitos
Instagram
@espanol_sin_fronteras_org